<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script type="text/javascript" src="../vue/vue.js"></script>
</head>
<body>
<div id="app">
   {{msg}}
    <hr>
    <input type="button" value="添加" @click="add">
    <ul>
        <li v-for="(value,index) in list">
            {{ value}} {{ index}}
        </li>
        <hr>
        <li v-for="(val,key,index) in json"
            :key="index" >
            <!--提升循环的性能-->
            {{val}} {{key}} {{index}}
        </li>
    </ul>
</div>
<script>
    new Vue({
        data:{
            msg:'数组',
            list:['apple','banana','bus'],
            json:{
                a:'apple',
                b:'banna',
                c:'car'
            }
        },
        methods:{
            add(){
                this.list.push('car')
            }
        }
    }).$mount('#app')
</script>
</body>
</html>